.main {
  width: 100%;
}
.main .banner-main {
  width: 678px;
  height: 240px;
}
.main .nav-list {
  display: flex;
  justify-content: space-between;
  width: 1200px;
  height: 76px;
  margin-top: 60px;
  margin-bottom: 40px;
  padding: 6px;
  opacity: 1;
  border-radius: 20px;
  background: #f7fbfe;
  border: 1px solid #e4e7eb;
}
.main .nav-list .item-nav {
  width: 297px;
  height: 64px;
  opacity: 1;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 64px;
  color: #333333;
  text-align: center;
}
.main .nav-list .item-nav.active {
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0px 2px 4px rgba(223, 234, 242, 0.39), 0px 10px 20px 10px rgba(223, 234, 242, 0.2);
}
.main .category-list {
  width: 100%;
}
.main .category-list .item-category {
  display: none;
  width: 100%;
  min-height: 300px;
}
.main .category-list .item-category:nth-child(1) .overview {
  display: flex;
  width: 1200px;
  height: 492px;
  border-radius: 20px;
  background: #f7f9fa;
}
.main .category-list .item-category:nth-child(1) .overview .keypoint-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 602px;
  height: 100%;
  padding-top: 128px;
  padding-bottom: 128px;
  padding-left: 140px;
  padding-right: 50px;
}
.main .category-list .item-category:nth-child(1) .overview .keypoint-list .item-keypoint {
  width: 169px;
}
.main .category-list .item-category:nth-child(1) .overview .keypoint-list .item-keypoint .title {
  width: 169px;
  height: 66px;
  font-size: 56px;
  font-weight: 700;
  letter-spacing: 0px;
  line-height: 65.63px;
  color: #333333;
  text-align: left;
  vertical-align: top;
}
.main .category-list .item-category:nth-child(1) .overview .keypoint-list .item-keypoint .desc {
  height: 26px;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 25.78px;
  color: #999999;
  text-align: left;
  vertical-align: top;
}
.main .category-list .item-category:nth-child(1) .overview .courses {
  position: relative;
  width: 405px;
  height: 405px;
  align-self: center;
}
.main .category-list .item-category:nth-child(1) .overview .courses .circle {
  position: absolute;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0px;
  color: #333333;
  text-align: center;
  line-height: 230px;
}
.main .category-list .item-category:nth-child(1) .overview .courses .circle:nth-child(1) {
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(251, 194, 235, 0.1) 0%, #a6c1ee 100%);
}
.main .category-list .item-category:nth-child(1) .overview .courses .circle:nth-child(2) {
  top: 0;
  right: 0;
  background: linear-gradient(180deg, #ffecd2 0%, rgba(252, 182, 159, 0.1) 100%);
}
.main .category-list .item-category:nth-child(1) .overview .courses .circle:nth-child(3) {
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(253, 160, 133, 0.1) 0%, #f6d365 100%);
}
.main .category-list .item-category:nth-child(1) .overview .courses .circle:nth-child(4) {
  bottom: 0;
  right: 0;
  background: linear-gradient(180deg, #cd9cf2 0%, rgba(246, 243, 255, 0.1) 100%);
}
.main .category-list .item-category:nth-child(1) .profile {
  width: 1200px;
  margin-top: 150px;
}
.main .category-list .item-category:nth-child(1) .profile .introduce {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding-top: 60px;
}
.main .category-list .item-category:nth-child(1) .profile .introduce img {
  width: 559px;
  height: 313px;
}
.main .category-list .item-category:nth-child(1) .profile .introduce .summary {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 600px;
  height: 336px;
}
.main .category-list .item-category:nth-child(1) .profile .introduce .summary p {
  text-indent: 2em;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 32px;
  color: #333333;
}
.main .category-list .item-category:nth-child(1) .profile .slogan {
  display: flex;
  width: 1200px;
  height: 480px;
  margin-top: 50px;
  padding: 60px;
  border-radius: 20px;
  background: #f7f9fa;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list,
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list {
  border-right: 1px solid #e4e7eb;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list .item-left-dream {
  display: flex;
  justify-content: end;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list .item-left-dream .dream {
  text-align: right;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list .item-left-dream .dream .title {
  font-size: 44px;
  font-weight: 500;
  letter-spacing: 0px;
  line-height: 51.57px;
  color: #333333;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list .item-left-dream .dream .desc {
  margin-top: 11px;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 26px;
  color: #333333;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .left-dream-list .item-left-dream img {
  width: 125px;
  height: 125px;
  margin-right: 40px;
  margin-left: 50px;
  vertical-align: middle;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list .item-right-dream {
  display: flex;
  justify-content: start;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list .item-right-dream img {
  width: 125px;
  height: 125px;
  margin-left: 40px;
  margin-right: 50px;
  vertical-align: middle;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list .item-right-dream .dream {
  text-align: left;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list .item-right-dream .dream .title {
  font-size: 44px;
  font-weight: 500;
  letter-spacing: 0px;
  line-height: 51.57px;
  color: #333333;
}
.main .category-list .item-category:nth-child(1) .profile .slogan .right-dream-list .item-right-dream .dream .desc {
  margin-top: 11px;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 26px;
  color: #333333;
}
.main .category-list .item-category:nth-child(2) {
  width: 1200px;
}
.main .category-list .item-category:nth-child(2) table {
  width: 1200px;
  height: 512px;
  margin-top: 60px;
  border-spacing: 0;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0px 2px 4px rgba(223, 234, 242, 0.39), 0px 10px 20px 10px rgba(223, 234, 242, 0.2);
}
.main .category-list .item-category:nth-child(2) table thead {
  height: 93px;
  border-radius: 20px 20px 0 0;
  background: #f7f9fa;
}
.main .category-list .item-category:nth-child(2) table thead tr th {
  text-align: center;
  border-right: 1px solid #e4e7eb;
  border-bottom: 1px solid #e4e7eb;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0px;
  color: #333333;
}
.main .category-list .item-category:nth-child(2) table thead tr th:nth-child(1) {
  width: 220px;
  border-top-left-radius: 20px;
}
.main .category-list .item-category:nth-child(2) table thead tr th:nth-child(2) {
  width: 330px;
}
.main .category-list .item-category:nth-child(2) table thead tr th:nth-child(3) {
  width: 250px;
}
.main .category-list .item-category:nth-child(2) table thead tr th:nth-child(4) {
  width: 180px;
}
.main .category-list .item-category:nth-child(2) table thead tr th:nth-child(5) {
  width: 220px;
  border-top-right-radius: 20px;
  border-right: none;
}
.main .category-list .item-category:nth-child(2) table tbody {
  height: 320px;
}
.main .category-list .item-category:nth-child(2) table tbody tr td {
  text-align: center;
  border-right: 1px solid #e4e7eb;
  border-bottom: 1px solid #e4e7eb;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0px;
  color: #333333;
}
.main .category-list .item-category:nth-child(2) table tbody tr td:last-child {
  border-right: none;
}
.main .category-list .item-category:nth-child(2) table tfoot {
  height: 99px;
}
.main .category-list .item-category:nth-child(2) table tfoot tr td {
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0px;
  color: #333333;
}
.main .category-list .item-category:nth-child(2) table tfoot tr td span {
  color: #1842b6;
}
.main .category-list .item-category:nth-child(3) {
  width: 1200px;
}
.main .category-list .item-category:nth-child(4) {
  width: 1200px;
}
.main .category-list .item-category.active {
  display: block;
}
